<template>
    <el-submenu v-if="item.children && item.children.length" :index="navIndex"> 
        <!-- 创建父级菜单 -->
        <template slot="title"><i class="el-icon-menu"></i>{{ item.name }}</template>
        <!-- 创建子菜单 -->
        <menuItem v-for="(subItem, i) in item.children" :key="navIndex+'-'+i" :navIndex="navIndex+'-'+i" :item="subItem" ></menuItem>
    </el-submenu>

    <el-menu-item 
        v-else 
        :index="item.url" 
        :route="{path: item.url}" 
        @click="selectPages(item.name, item.url)"><i class="el-icon-menu"></i>{{ item.name }}</el-menu-item>
</template>

<script>
export default {
    name: 'menuItem',
    props: ['item','navIndex'],
    data() {
        return {
            
        }
    },
    methods: {
        selectPages(name, url) {
            console.log(name,url)
            this.$router.push(url)
        }
    }
}
</script>

<style>

</style>